Skip to main content

How to get on click event expression using console.log (event)

  • This document shows how to get on click value using events for different widgets. Once you get the expression, you can use this expression to get the on click value from the widget and that value will be later used to filter other widgets or to pass in embed link as well.

Objective​

  • To get on click value using events for different widgets

Prerequisites​

  • For this example; we are using Demo Dashboard & Salesb.ds Dataset files.

Download dashboard.zip file from link given dashboard.zip.

  • After downloading the zip file, open console folder inside it & upload Demo Dashboard Dashboard Section & Salesb.ds into Master Data --> Dataset Section of the OPNBI. To add it into OPNBI follow this Link.

Steps to get value using event for different widgets​

  1. Login to OPNBI using system credentials.

  2. Create a dashboard and add pie chart widget. Follow this link to see how to create dashboard.

  3. Form a pie chart with any data you want. Here for demo I am taking country and priceEach as a value and sum as aggrigation as shown in below image,

    Docusaurus Slash Introduction

  4. Now I want to get the country value when I click on any slice of pie chart.

  5. To do this, we will use predefined OPNBI events.

  6. To know event expression, just go to event tab and print event in console using this expression;

console.log(event);

Docusaurus Slash Introduction

  1. Click on save and exit button to save this event

  2. Now go to dashboard preview mode and open developer tools (ctrl + shift + i)

  3. open console tab from developer window

    Docusaurus Slash Introduction

  4. Now when you click on any slice of pie chart for example click on USA, and check console window, you will find event is printed.

    Docusaurus Slash Introduction

  5. To get the clicked value, just open this event list, and search for the country name USA. Here it will be found at event>event>point>x as shown in below image,

    Docusaurus Slash Introduction

  6. so now to get the clicked value in a variable, go to dashboard edit mode, edit the chart and go to event tab and write this expression;

var a= event.event.point.x;
And print it in console;
console.log(a);

  1. Save the changes and Now go to preview, keep console open and click on any slice you will see clicked value in console.

    Docusaurus Slash Introduction

  2. Same way you can create custom event to get the on click data of widget, store it in a variable and use it later to filter the data using filter event.